Using jsPsych and cognition.run
Session 2 - intermediate
Translations available
Disclaimer: may not be very accurate…
Worksheet overview
Aims
By the end of this worksheet you should be able to:
- program your own experiments in jsPsych
- host the experiment online using cognition.run
- use the participant data for analysis
- apply the basic skills you have learnt for your own purposes
- learn some extra skills such as HTML, javascript, CSS and JSON
Pre-requisites
To complete the aims you will need to:
- follow this worksheet
- ask questions if you are not sure/be able to google
- have a working computer and internet connection
- be patient when things do not work
You do not need to:
- have any programming knowledge
- have high computer literacy
- know anything about jsPsych, cognition.run, html, css or javascript
- be a linguist
Structure
The worksheet will go through the following sections:
Introducing cognition.run
- creating an account
- considerations when using it
- familiarisation with the interface
Introducing jsPsych
- what it is
- considerations when using it
- using official documentation
Running experiments
- integrating JsPsych with cognition.run
- familiarisation with JsPsych programming
- building a very simple experiment
Up next
In the next sessions we will cover:
- building a proper experiment
- using stimuli files
- customising plugins
- customising appearance
- working with the data
Recap
In the last session we should have:
- set up an account for cognition.run
- become familiar with the cognition.run interface
- become familiar with JsPsych
- learnt what a plugin is and how they work
- built a very simple experiment
LS0tCnRpdGxlOiAiVXNpbmcganNQc3ljaCBhbmQgY29nbml0aW9uLnJ1biIKc3VidGl0bGU6ICJTZXNzaW9uIDIgLSBpbnRlcm1lZGlhdGUiCmF1dGhvcjogIkphbWVzIEJyYW5kIgpkYXRlOiAiYHIgZm9ybWF0KFN5cy50aW1lKCksICclZCAlQiwgJVknKWAiCm91dHB1dDoKICBybWRmb3JtYXRzOjpyZWFkdGhlZG93bjoKICAgIHBhbmRvY19hcmdzOiAiLS1oaWdobGlnaHQtc3R5bGU9bXkudGhlbWUiCiAgICBoaWdobGlnaHQ6IHB5Z21lbnRzCiAgICB0b2NfZmxvYXQ6IHRydWUKICAgIGNvZGVfZG93bmxvYWQ6IHRydWUKICAgIHRvY19kZXB0aDogMwogICAgY29sbGFwc2VkOiBmYWxzZQogICAgZGZfcHJpbnQ6IHBhZ2VkCiAgICBsaWdodGJveDogVFJVRQogICAgZ2FsbGVyeTogVFJVRQogICAgY3NzOiAiY3NzL3N0eWxlLmNzcyIKICAgIAotLS0KCmBgYHtyIGVjaG89RkFMU0UsIHdhcm5pbmc9RkFMU0V9CmxpYnJhcnkoc2xpY2tSKQpsaWJyYXJ5KGh0bWx0b29scykKbGlicmFyeSh4YXJpbmdhbkV4dHJhKQpsaWJyYXJ5KHJtYXJrZG93bikKbGlicmFyeShmb250YXdlc29tZSkKbGlicmFyeShic3BsdXMpCgpgYGAKCmBgYHtyIHNldHVwLCB3YXJuaW5nPUZBTFNFLCBlY2hvPUZBTFNFfQprbml0cjo6b3B0c19jaHVuayRzZXQoZWNobyA9IFRSVUUsCiAgICAgICAgICAgICAgICAgICAgICBldmFsID0gRkFMU0UsCiAgICAgICAgICAgICAgICAgICAgICBjb21tZW50ID0gTkEpCgprbml0cjo6a25pdF9ob29rcyRzZXQoCiAgbWVzc2FnZSA9IGZ1bmN0aW9uKHgsIG9wdGlvbnMpIHsKICAgICBwYXN0ZSgnPGJ1dHRvbiB0eXBlPSJidXR0b24iIGNsYXNzPSJjb2xsYXBzaWJsZTEiPjxzdHJvbmc+JywKICAgICBmYShuYW1lID0gImNpcmNsZS1pbmZvIiksCiAgICAgJyBtb3JlIGluZm88L3N0cm9uZz48L2J1dHRvbj4nLCAnPGRpdiBjbGFzcz0iY29udGVudDEiPjxwPicsCiAgICAgZ3N1YignIyMnLCAnXG4nLCB4KSwKICAgICAnPC9wPjwvZGl2PicsCiAgICAgc2VwID0gJ1xuJykKICAgfSkKCmNvZGVibG9jayA9IGZ1bmN0aW9uKHgsIG9wdGlvbnMpIHsKICAgICBjYXQocGFzdGUoJzxkaXYgY2xhc3M9ImNvZGVibG9jayI+JywKICAgICBwYXN0ZTAoeCksCiAgICAgJzwvZGl2PicsCiAgICAgc2VwID0gJ1xuJykpCiAgIH0KCmBgYAoKLS0tCgojIyBgciBmYSgibGFuZ3VhZ2UiKWAgVHJhbnNsYXRpb25zIGF2YWlsYWJsZQoKRGlzY2xhaW1lcjogbWF5IG5vdCBiZSB2ZXJ5IGFjY3VyYXRlLi4uCgo8ZGl2IGlkPSJnb29nbGVfdHJhbnNsYXRlX2VsZW1lbnQiPjwvZGl2PgoKLS0tCgojIFdvcmtzaGVldCBvdmVydmlldwoKIyMgYHIgZmEoImNyb3NzaGFpcnMiKWAgQWltcwoKQnkgdGhlIGVuZCBvZiB0aGlzIHdvcmtzaGVldCB5b3Ugc2hvdWxkIGJlIGFibGUgdG86CgotICoqcHJvZ3JhbSoqIHlvdXIgb3duIGV4cGVyaW1lbnRzIGluIGpzUHN5Y2gKLSAqKmhvc3QqKiB0aGUgZXhwZXJpbWVudCBvbmxpbmUgdXNpbmcgY29nbml0aW9uLnJ1bgotICoqdXNlKiogdGhlIHBhcnRpY2lwYW50IGRhdGEgZm9yIGFuYWx5c2lzCi0gKiphcHBseSoqIHRoZSBiYXNpYyBza2lsbHMgeW91IGhhdmUgbGVhcm50IGZvciB5b3VyIG93biBwdXJwb3NlcwotICoqbGVhcm4qKiBzb21lIGV4dHJhIHNraWxscyBzdWNoIGFzIEhUTUwsIGphdmFzY3JpcHQsIENTUyBhbmQgSlNPTgoKIyMgYHIgZmEoInVzZXItZ3JhZHVhdGUiKWAgUHJlLXJlcXVpc2l0ZXMKClRvIGNvbXBsZXRlIHRoZSBhaW1zIHlvdSB3aWxsIG5lZWQgdG86CgotICoqZm9sbG93KiogdGhpcyB3b3Jrc2hlZXQKLSAqKmFzayoqIHF1ZXN0aW9ucyBpZiB5b3UgYXJlIG5vdCBzdXJlL2JlIGFibGUgdG8gZ29vZ2xlCi0gKipoYXZlKiogYSB3b3JraW5nIGNvbXB1dGVyIGFuZCBpbnRlcm5ldCBjb25uZWN0aW9uCi0gKipiZSBwYXRpZW50Kiogd2hlbiB0aGluZ3MgZG8gbm90IHdvcmsKCllvdSBkbyBub3QgbmVlZCB0bzoKCi0gaGF2ZSBhbnkgKipwcm9ncmFtbWluZyBrbm93bGVkZ2UqKgotIGhhdmUgaGlnaCAqKmNvbXB1dGVyIGxpdGVyYWN5KioKLSBrbm93IGFueXRoaW5nIGFib3V0ICoqanNQc3ljaCwgY29nbml0aW9uLnJ1biwgaHRtbCwgY3NzIG9yIGphdmFzY3JpcHQqKgotIGJlIGEgKipsaW5ndWlzdCoqCgojIyBgciBmYSgiZm9sZGVyLXRyZWUiKWAgU3RydWN0dXJlCgpUaGUgd29ya3NoZWV0IHdpbGwgZ28gdGhyb3VnaCB0aGUgZm9sbG93aW5nIHNlY3Rpb25zOgoKLSBJbnRyb2R1Y2luZyBjb2duaXRpb24ucnVuCgogICAgLSBjcmVhdGluZyBhbiBhY2NvdW50CiAgICAtIGNvbnNpZGVyYXRpb25zIHdoZW4gdXNpbmcgaXQKICAgIC0gZmFtaWxpYXJpc2F0aW9uIHdpdGggdGhlIGludGVyZmFjZQo8YnIvPjxici8+Ci0gSW50cm9kdWNpbmcganNQc3ljaAoKICAgIC0gd2hhdCBpdCBpcwogICAgLSBjb25zaWRlcmF0aW9ucyB3aGVuIHVzaW5nIGl0CiAgICAtIHVzaW5nIG9mZmljaWFsIGRvY3VtZW50YXRpb24KPGJyLz48YnIvPgotIFJ1bm5pbmcgZXhwZXJpbWVudHMKCiAgICAtIGludGVncmF0aW5nIEpzUHN5Y2ggd2l0aCBjb2duaXRpb24ucnVuCiAgICAtIGZhbWlsaWFyaXNhdGlvbiB3aXRoIEpzUHN5Y2ggcHJvZ3JhbW1pbmcKICAgIC0gYnVpbGRpbmcgYSB2ZXJ5IHNpbXBsZSBleHBlcmltZW50CgojIyBgciBmYSgiYXJyb3ctcmlnaHQiKWAgVXAgbmV4dAoKSW4gdGhlIG5leHQgc2Vzc2lvbnMgd2Ugd2lsbCBjb3ZlcjoKCi0gYnVpbGRpbmcgYSBwcm9wZXIgZXhwZXJpbWVudAotIHVzaW5nIHN0aW11bGkgZmlsZXMKLSBjdXN0b21pc2luZyBwbHVnaW5zCi0gY3VzdG9taXNpbmcgYXBwZWFyYW5jZQotIHdvcmtpbmcgd2l0aCB0aGUgZGF0YQoKIyMgYHIgZmEoImJhY2t3YXJkIilgIFJlY2FwCgpJbiB0aGUgbGFzdCBzZXNzaW9uIHdlIHNob3VsZCBoYXZlOgoKLSBzZXQgdXAgYW4gYWNjb3VudCBmb3IgY29nbml0aW9uLnJ1bgotIGJlY29tZSBmYW1pbGlhciB3aXRoIHRoZSBjb2duaXRpb24ucnVuIGludGVyZmFjZQotIGJlY29tZSBmYW1pbGlhciB3aXRoIEpzUHN5Y2gKLSBsZWFybnQgd2hhdCBhIHBsdWdpbiBpcyBhbmQgaG93IHRoZXkgd29yawotIGJ1aWx0IGEgdmVyeSBzaW1wbGUgZXhwZXJpbWVudAoKLS0tCgoKCgoKCgoKYGBge3IgZWNobz1GQUxTRSwgZXZhbD1UUlVFLCB3YXJuaW5nPUZBTFNFfQpodG1sdG9vbHM6OnRhZ3Mkc2NyaXB0KHNyYyA9ICJqcy90cmFuc2xhdGUuanMiKQojIGh0bWx0b29sczo6dGFncyRzY3JpcHQoc3JjID0gImpzL2luZm9ib3guanMiKQpodG1sdG9vbHM6OnRhZ3Mkc2NyaXB0KHNyYz0iLy90cmFuc2xhdGUuZ29vZ2xlLmNvbS90cmFuc2xhdGVfYS9lbGVtZW50LmpzP2NiPWdvb2dsZVRyYW5zbGF0ZUVsZW1lbnRJbml0IikKCmh0bWx0b29sczo6dGFnTGlzdCgKICB4YXJpbmdhbkV4dHJhOjp1c2VfY2xpcGJvYXJkKAogICAgYnV0dG9uX3RleHQgPSAiPGkgY2xhc3M9XCJmYSBmYS1jbGlwYm9hcmRcIiBzdHlsZT1cImZvbnQtc2l6ZTogMjVweFwiPjwvaT4iLAogICAgc3VjY2Vzc190ZXh0ID0gIjxpIGNsYXNzPVwiZmEgZmEtY2hlY2tcIiBzdHlsZT1cImNvbG9yOiAjOTBCRTZEOyBmb250LXNpemU6IDI1cHhcIj48L2k+IiwKICApLAogIHJtYXJrZG93bjo6aHRtbF9kZXBlbmRlbmN5X2ZvbnRfYXdlc29tZSgpCikKCmBgYAoKYGBge2pzIGVjaG89RkFMU0UsIGV2YWw9VFJVRX0KdmFyIGNvbGwgPSBkb2N1bWVudC5nZXRFbGVtZW50c0J5Q2xhc3NOYW1lKCJjb2xsYXBzaWJsZTEiKTsKdmFyIGk7Cgpmb3IgKGkgPSAwOyBpIDwgY29sbC5sZW5ndGg7IGkrKykgewogIGNvbGxbaV0uYWRkRXZlbnRMaXN0ZW5lcigiY2xpY2siLCBmdW5jdGlvbigpIHsKICAgIHRoaXMuY2xhc3NMaXN0LnRvZ2dsZSgiYWN0aXZlMSIpOwogICAgdmFyIGNvbnRlbnQgPSB0aGlzLm5leHRFbGVtZW50U2libGluZzsKICAgIGlmIChjb250ZW50LnN0eWxlLm1heEhlaWdodCl7CiAgICAgIGNvbnRlbnQuc3R5bGUubWF4SGVpZ2h0ID0gbnVsbDsKICAgIH0gZWxzZSB7CiAgICAgIGNvbnRlbnQuc3R5bGUubWF4SGVpZ2h0ID0gY29udGVudC5zY3JvbGxIZWlnaHQgKyAicHgiOwogICAgfQogIH0pOwp9CgpgYGAK